<template>
	<view class="content">
		<u-navbar back-text="" slot="left" :autoBack="true" safeAreaInsetTop placeholder>
			<view slot="center" class="leftText">{{orderinfo.title}}</view>
		</u-navbar>
		<view class="noticelist">
			<block v-if="cardList && cardList.length>0">
			<view class="noticeListi" v-for="(item,index) in cardList" :key="index">
				<view class="userIcon">
					<image mode="aspectFill" :src="item.avatar?item.avatar:'http://xgr.oss-cn-hangzhou.aliyuncs.com/icon/images/default-avatar.png'"></image>
					<!-- <view class="tip">个人</view> -->
				</view>
				<view class="userName">
					<view class="name">{{item.nickName?item.nickName:'先生'}}
						<block v-if="item.isRealName">
							<image src="http://xgr.oss-cn-hangzhou.aliyuncs.com/icon/images/user-real.svg" />
							<view class="authMe" v-if="">已实名</view>
						</block>
						<view class="time">{{item.create_time}}</view>
					</view>
					<view class="tag">
						<view v-for="(v,i) in item.skillsList">{{v}}</view>
					</view>
				</view>
			</view>
			</block>
			<!--list over-->
			<block v-else>
				<view class="empty-img">
					<image src="http://xgr.oss-cn-hangzhou.aliyuncs.com/icon/images/icon50.png"></image>
				</view>
			</block>
		</view>
	</view>
</template>
<script>
	import store from '@/common/store.js'
	import Index from '@/common/index-model.js'
	import fun from '@/common/publicFun.js'
	let index=new Index();
	export default {
		data() {
			return {
				orderId:0,
				orderinfo:{},
				cardList:[],
				time:fun.formatDate(new Date,"yyyy-MM-dd hh:mm:ss")
			};
		},
		onLoad(opt) {
			this.orderId=opt.orderId;
			this.getOrderInfo()
			this.getCardList()
		},
		onPullDownRefresh() {
			this.time=fun.formatDate(new Date,"yyyy-MM-dd hh:mm:ss");
			this.getCardList();
			setTimeout(function () {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		methods: {
			//获取详情
			getOrderInfo() {
				let url="client/job/find/details/"+this.orderId
				index.getPublicUserMember({},url,'get',res=>{
					if(res.data.code == 200 && res.data.success){
						this.orderinfo = res.data.result;
					}
				})
			},
			getCardList(){//查询通知消息
				let url="/client/message/recruit/workers"
				let cardList=[];
				index.getPublicUserMember({time:this.time,orderId:this.orderId},url,'POST',res=>{
					if(res.data.code==200){
						res.data.result.forEach((item,ind)=>{
							if(item.skills){
								item.skillsList=index.strTrim(item.skills,',').split(',');
							}							
							cardList.push(item);
						})
						this.cardList=cardList;
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
@import url("index.css");
@import url("@/static/css/publics.css");
::v-deep {
	.u-navbar--fixed {	  
		background: #fff;
		& > view {
			background: transparent !important;
		}
		.leftText {
			color: #000;
			font-size: 36rpx;
			font-weight: bold;
		}
		.u-nav-slot{ display: flex;}
	}
	.con{ padding: 0 20rpx;}
	.con .title{ color: #0F0F0F; font-size: 36rpx; margin-bottom: 20rpx; font-weight: bold;}
	.con .date{ color: #A1A1A1; font-size: 24rpx; margin-bottom: 20rpx;}
	.con .content{ color: #424242; font-size: 28rpx;}
}
.noticelist{
	padding: 0rpx 0rpx;
}
.noticelist .noticeListi{ margin-top: 30rpx; display: flex; padding: 0rpx 20rpx;}
.noticelist .noticeListi .userIcon{ width: 104rpx; height: 104rpx; margin-right: 20rpx; position: relative;}
.noticelist .noticeListi .userIcon image{ width: 100%; height: 100%; border-radius: 6rpx;}
.noticelist .noticeListi .userIcon .tip{ 
	width: 44rpx; 
	height: 28rpx; 
	background: rgba(15, 15, 15, 0.5); 
	color: #fff;
	font-size: 20rpx;
	line-height: 28rpx;
	text-align: center;
	position: absolute; bottom: 0; 
	right: 0rpx;
	border-radius: 0px 0px 3px 0px;
}

.noticelist .noticeListi .userName {padding-bottom: 40rpx; height: 104rpx; border-bottom: 1px solid #D8D8D8; width: calc(100% - 124rpx);}
.noticelist .noticeListi .userName .name{ font-weight: bold; display: flex; width: 100%; font-size: 32rpx; line-height: 38rpx;} 
.noticelist .noticeListi .userName .name image{ width: 28rpx; height: 28rpx; margin-top: 10rpx; margin-left: 20rpx;}
.noticelist .noticeListi .userName .name .authMe{ color: #A1A1A1; font-size: 24rpx; font-weight: 100; margin-left: 10rpx;}
.time{ flex: 1; text-align: right; font-size: 24rpx; color: #A1A1A1; font-weight: 100;}
.noticelist .noticeListi .userName .tag{ 
	font-size: 26rpx; line-height: 31rpx; display: flex; color: #A1A1A1; 
	margin-top: 14rpx; font-weight: 500; flex-wrap: wrap;
	height: 60rpx; overflow: hidden;
	
} 
.noticelist .noticeListi .userName .tag view{ width: auto; background: #F7F7F7; margin-right: 16rpx; 
	background: #F7F7F7; color: #0F0F0F; border-radius: 6rpx; padding: 2rpx 16rpx; margin-bottom: 10rpx;
}
.noticelist .noticeListi:last-child .userName{ border: none;}
</style>